<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>订单列表</title>
    <link rel="stylesheet" type="text/css" href="statics/xjl/css/jq22-demo.css">
    <link rel="stylesheet" type="text/css" href="statics/xjl/css/jquery-confirm.css" />

    <script type="text/javascript" src="statics/js/jquery.js"></script>

    <script>window.jQuery || document.write('<script src="statics/xjl/js/jquery-1.11.0.min.js"><\/script>')</script>
    <script src="statics/xjl/js/jquery.sticky.min.js"></script>

    <script type="text/javascript" src="statics/xjl/js/jquery-confirm.js"></script>


    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="statics/css/bootstrap.css">
    <link rel="stylesheet" href="statics/css/bootstrap-datetimepicker.css">
    <link type="text/css" rel="stylesheet" href="statics/css/uiAlertView-1.0.0.css" />
    <script src="https://cdn.bootcss.com/holder/2.9.4/holder.min.js"></script>

    <script type="text/javascript" src="statics/js/popper.min.js"></script>
    <script type="text/javascript" src="statics/js/bootstrap.js"></script>
    <script type="text/javascript" src="statics/js/bootstrap-datetimepicker.js"></script>
    <script type="text/javascript" src="statics/js/bootstrap-datetimepicker.zh-CN.js"></script>
    <script type="text/javascript" src="statics/js/jquery.uiAlertView-1.0.0.js"></script>
</head>
<style>
    #eTable td{
        border-top-width: 0
    }
    .table th, .table td {
        text-align: center;
        vertical-align: middle!important;
    }
</style>
<script type="text/javascript">
    $(function () {
        var stateValue = $("#state").val();
        if (stateValue=="1") {
            $('#myTab a:last').tab('show');
        }
    });
    //设置点击时间


    function doPage(pageNumOne,pageNumTwo,state) {


       window.location.href="handleEquipmentList?pageNo1="+pageNumOne+"&pageNo2="+pageNumTwo+"&state="+state;

    }

</script>
<script type="text/javascript">

    function cancelOrder(equipmentSheetNo) {
        $.confirm({
            title: '取消装潢单',
            content: '确定取消装潢单'+equipmentSheetNo+'吗?',
            columnClass: 'col-md-6 col-md-offset-3',
            confirmButtonClass: 'btn-danger',
            cancelButtonClass: 'btn-info',
            theme: 'material',
            animationBounce: 2.5,
            confirm: function () {
                $.alert('已成功取消!');
                window.location.href="cancelOrderHandle?equipmentSheetNO="+equipmentSheetNo;
            },
            cancel: function () {

            }
        });


    }




    function transDate(data) {
        var date = new Date(data);
        Y = date.getFullYear() + '-';
        M = ((date.getMonth()+1)<10? '0'+(date.getMonth()+1):date.getMonth()+1) + '-';
        D = date.getDate() + ' ';

        return Y+M+D;

    }
    function sendMessageByTel(date,equipmentSheetNo) {
        var pageNo1=$("#pageNo1").val();
        var pageNo2=$("#pageNo2").val();

        window.location.href="sendMessageCode?tel="+date+"&pageNo1="+pageNo1+"&pageNo2="+pageNo2+"&equipmentSheetNo="+equipmentSheetNo;

    }


</script>

<body>

<input type="hidden"  id="pageNo1" value="${pageUtil.pageNo1}">
<input type="hidden"  id="pageNo2" value="${pageUtil.pageNo2}">
<input type="hidden"  id="state" value="${state!}">
<div class="container">
    <ul id="myTab" class="nav nav-tabs">
        <li class="active">
            <a href="#home" data-toggle="tab">
                审核通过
            </a>
        </li>
        <li><a href="#ios" data-toggle="tab">审核驳回</a></li>
    </ul>
    <div id="myTabContent" class="tab-content">
        <div class="tab-pane fade in active" id="home">
            <table class="table table-striped table-bordered table-hover table-condensed table-responsive"
                   id="equipmentMessage">
                <tr class="success">
                    <th>序号</th>
                    <th>操作</th>
                    <th>装潢单号</th>
                    <th>装饰业务类型</th>
                    <th>客户编号</th>
                    <th>客户名称</th>
                    <th>联系电话</th>
                    <th>VIN</th>
                    <th>开单时间</th>
                    <th>合计金额</th>
                    <th>赠送金额</th>
                    <th>应收金额</th>
                    <th>已受金额</th>
                    <th>订单状态</th>
                </tr>
                <#list pageUtil.list1 as equipmentSheet>
                <tr class="active">
                    <td>1</td>
                    <td>



                        <button class="btn btn-info btn-sm"
                                onclick="javascript:showEquipmentDetail(${equipmentSheet.equipmentSheetNo})"><span class="glyphicon glyphicon-align-center" style="color: rgb(0, 0, 0);
                             font-size: 16px;" title="详情"></span>
                        </button>
                        <button class="btn btn-info btn-sm"
                                onclick="sendMessageByTel(${equipmentSheet.customerTel},${equipmentSheet.equipmentSheetNo})"><span class="glyphicon glyphicon-send" style="color: rgb(0, 0, 0); font-size: 16px;" title="发送短信"> </span></button>
                    </td>
                    <td>${equipmentSheet.equipmentSheetNo}</td>
                    <td>${equipmentSheet.upholsteryType}</td>
                    <td>${equipmentSheet.customerId}</td>
                    <td>${equipmentSheet.customerName}</td>
                    <td>${equipmentSheet.customerTel}</td>
                    <td>${equipmentSheet.vin}</td>

                    <td>${equipmentSheet.openingTime}</td>
                    <td>${equipmentSheet.totalPrice}</td>
                    <td>${equipmentSheet.givenMoney}</td>
                    <td>${equipmentSheet.receivables}</td>
                    <td>${equipmentSheet.received}</td>
                    <td>${equipmentSheet.equipmentSheetState}</td>
                </tr>


            </#list>

            <tr>
            </tr>
            </table>
            <div class=" center-block">
                <button class="btn-info col-sm-1" onclick="doPage(1,${pageUtil.pageNo2},0)">首页</button>
                <button class="btn-info col-sm-1" onclick="doPage(${pageUtil.pageNo1-1},${pageUtil.pageNo2},0)">上一页</button>
                <button class="btn-info col-sm-1" onclick="doPage(${pageUtil.pageNo1+1},${pageUtil.pageNo2},0)">下一页</button>
                <button class="btn-info col-sm-1" onclick="doPage(${pageUtil.pageTotal1},${pageUtil.pageNo2},0)">末页</button>
                <span class="col-sm-1"></span></div>
        </div>
        <div class="tab-pane fade" id="ios">
            <table class="table table-striped table-bordered table-hover table-condensed table-responsive"
                   id="equipmentMessage2">
                <tr class="success">
                    <th>序号</th>
                    <th>操作</th>
                    <th>装潢单号</th>
                    <th>装饰业务类型</th>
                    <th>客户编号</th>
                    <th>客户名称</th>
                    <th>联系电话</th>
                    <th>VIN</th>
                    <th>开单时间</th>
                    <th>合计金额</th>
                    <th>赠送金额</th>
                    <th>应收金额</th>
                    <th>已受金额</th>
                    <th>订单状态</th>
                </tr>
                <#list pageUtil.list2 as equipmentSheet2>
                <tr class="active">
                    <td>1</td>
                    <td>

                        <button class="btn btn-info btn-sm"
                                onclick="javascript:showEquipmentDetail(${equipmentSheet2.equipmentSheetNo})"><span class="glyphicon glyphicon-align-center" style="color: rgb(0, 0, 0);
                             font-size: 16px;" title="详情"></span>
                        </button>
                        <button class="btn btn-info btn-sm"
                                onclick="javascript:cancelOrder(${equipmentSheet2.equipmentSheetNo})"><span class="glyphicon glyphicon-trash" style="color: rgb(0, 0, 0); font-size: 16px;" title="取消订单"> </span></button>
                    </td>
                    <td>${equipmentSheet2.equipmentSheetNo}</td>
                    <td>${equipmentSheet2.upholsteryType}</td>
                    <td>${equipmentSheet2.customerId}</td>
                    <td>${equipmentSheet2.customerName}</td>
                    <td>${equipmentSheet2.customerTel}</td>
                    <td>${equipmentSheet2.vin}</td>

                    <td>${equipmentSheet2.openingTime}</td>
                    <td>${equipmentSheet2.totalPrice}</td>
                    <td>${equipmentSheet2.givenMoney}</td>
                    <td>${equipmentSheet2.receivables}</td>
                    <td>${equipmentSheet2.received}</td>
                    <td>${equipmentSheet2.equipmentSheetState}</td>
                </tr>


            </#list>

            <tr>
            </tr>
            </table>
            <div class=" center-block">
                <button class="btn-info col-sm-1" onclick="doPage(${pageUtil.pageNo1},1,1)">首页</button>
                <button class="btn-info col-sm-1" onclick="doPage(${pageUtil.pageNo1},${pageUtil.pageNo2-1},1)">上一页</button>
                <button class="btn-info col-sm-1" onclick="doPage(${pageUtil.pageNo1},${pageUtil.pageNo2+1},1)">下一页</button>
                <button class="btn-info col-sm-1" onclick="doPage(${pageUtil.pageNo1},${pageUtil.pageTotal2},1)">末页</button>
                <span class="col-sm-1"></span></div>
        </div>

    </div>





<script type="text/javascript">




    //初始化标签，配置日期格式插件相关参数
    $(function () {
        $(".form_datetime").datetimepicker({
            format: 'yyyy-mm-dd',
            minView: 'month',
            language: 'zh-CN',
            autoclose: true,//选中自动关闭
            startDate: '1900-01-01',
            todayBtn: true
            //显示今日按钮
        });
    });



    //设置详情按键的事件
    function showEquipmentDetail(equipmentSheetNo) {
        $.getJSON("getEquipmentDetail", {"equipmentSheetNo": equipmentSheetNo},
            function (date) {
                $("#modifySubmit").show()
                $("#equipmentSheetNo1").val(date.equipmentSheetNo);
                $("#upholsteryType1").val(date.upholsteryType);
                $("#equipmentSheetState1").val(date.equipmentSheetState);
                $("#employeeName1").val(date.employeeName);
                var personList = date.installationPersonList;
                var s="<option  value='-1' selected>-请选择-</option>";
                for (i=0;i<personList.length;i++){
                    if (date.personNo==personList[i].personNo) {
                        s+="<option value='"+personList[i].personNo+"' selected>"+personList[i].personName+"</option>"
                    }else {
                    s+="<option value='"+personList[i].personNo+"'>"+personList[i].personName+"</option>";
                    }
                }
                $("#personNo1").append(s);
                $("#comment1").val(date.comment);
                $("#customerId1").val(date.customerId);
                $("#customerName1").val(date.customerName);
                $("#customerTel1").val(date.customerTel);
                $("#series1").val(date.series);
                $("#model1").val(date.model);
                $("#color1").val(date.color);
                $("#vin1").val(date.vin);
                $("#carCard1").val(date.carCard);
                $("#startTime1").val(transDate(date.startTime));
                $("#endingTime1").val(transDate(date.endingTime));
                temporary= date.temporaryCarPartsList
                var myStr="";
                for (i=0;i<temporary.length;i++) {
                    myStr+="<tr><td>"+(i+1)+"</td><td>"+temporary[i].carPartsName+"</td>"+
                        "<td>"+temporary[i].carPartsCount+"</td><td>"+temporary[i].metering+"</td>"+
                        "<td>"+temporary[i].guidedPrice+"</td><td>"+temporary[i].discountRate+"</td>"+
                        "<td>"+temporary[i].actualPrice+"</td><td>"+temporary[i].totalPrice+"</td></tr>";
                }
                $("#decorationTableList tr:not(:first)").remove();
                $("#decorationTableList").append(myStr);
                $("#totalPrice").val(date.totalPrice);
                $("#receivables").val(date.receivables);
                $("#givenMoney").val(date.givenMoney);
                $("#modifySubmit").click(function () {
                    modifyEquipmentSheet();
                });
                if (equipmentSheetState=="审核通过"||equipmentSheetState=="已完成") {
                    $("#modifySubmit").hide()
                }




            });

        $("#myModal").modal();


    }
    //设置修改按键的事件
    function modifyEquipmentSheet() {
        var equipmentSheetNo = $("#equipmentSheetNo1").val();
        var personNo = $("#personNo1 option:selected") .val();
        var comment = $("#comment1").val();
        var customerName = $("#customerName1").val();
        var customerTel =$("#customerTel1").val();
        var series = $("#series1").val();
        var model = $("#model1").val();
        var color =$("#color1").val();
        var vin =$("#vin1").val();
        var carCard =$("#carCard1").val();
        var startTime =$("#startTime1").val();
        var endingTime =$("#endingTime1").val();
       // 新建json对象
        var modifyEquipmentSheetVO={};
        modifyEquipmentSheetVO["equipmentSheetNo"]=equipmentSheetNo;
        modifyEquipmentSheetVO["personNo"]=personNo;
        modifyEquipmentSheetVO["comment"]=comment;
        modifyEquipmentSheetVO["customerName"]=customerName;
        modifyEquipmentSheetVO["customerTel"]=customerTel;
        modifyEquipmentSheetVO["series"]=series;
        modifyEquipmentSheetVO["equipmentSheetNo"]=equipmentSheetNo;
        modifyEquipmentSheetVO["model"]=model;
        modifyEquipmentSheetVO["color"]=color;
        modifyEquipmentSheetVO["vin"]=vin;
        modifyEquipmentSheetVO["carCard"]=carCard;
        modifyEquipmentSheetVO["startTime"]=startTime;
        modifyEquipmentSheetVO["endingTime"]=endingTime;
        $.ajax({
            type: "POST",
            url: "modifyEquipment",
            dataType: "json",
            contentType : "application/json;charset=utf-8",
            data:JSON.stringify(modifyEquipmentSheetVO) ,
            success: function (data){

                window.location.href="equipmentList";
            }})


    }
</script>



<!-- 模态框（Modal） -->
<div class="modal fade " id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"
     data-backdrop="static">
    <div class="modal-dialog" style="width: 1000px">
        <div class="modal-content">
            <div class="modal-header >
               <button type=" button
            " class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">装潢单录入</h4>
        </div>
        <div class="modal-body ">

            <div>

                <form class="form-horizontal">
                    <h3 class="page-header">装潢信息</h3>

                    <div class="form-inline">
                        <table class="table-responsive " style="border-collapse: separate;border-spacing:0 5px ">
                            <tr>
                                <td><label>装潢单号</label></td>
                                <td><input type="text" class="form-control" id="equipmentSheetNo1" readonly></td>

                                <td style="padding-left: 30px"><label>装潢业务类型</label></td>
                                <td><input type="text" class="form-control" id="upholsteryType1" readonly></td>

                                <td style="padding-left: 30px"><label>单据状态</label></td>
                                <td><input type="text" class="form-control" id="equipmentSheetState1" readonly></td>

                            </tr>


                            <tr style="margin-top: 10px">
                                <td><label>开单人</label></td>
                                <td><input type="text" class="form-control" id="employeeName1" readonly></td>

                                <td style="padding-left: 30px"><label>接单人</label></td>
                                <td><select id="personNo1" class="form-control"></select>



                            </tr>
                            <tr>
                                <td><label>备注</label></td>
                                <td colspan="5"><textarea type="text" class="form-control"
                                                          style="min-width:100%" id="comment1"></textarea></td>
                            </tr>
                        </table>

                    </div>
                </form>
            </div>
            <div>

                <form class="form-horizontal">
                    <h3 class="page-header">客户车辆信息</h3>

                    <div class="form-inline">
                        <table class="table-responsive " style="border-collapse: separate;border-spacing:0 5px ">
                            <tr>


                                <td><label>客户编号</label></td>
                                <td><input type="text" class="form-control" id="customerId1" readonly></td>

                                <td style="padding-left: 30px"><label>客户名称</label></td>
                                <td><input type="text" class="form-control" id="customerName1"></td>

                                <td><label style="padding-left: 30px">电话</label></td>
                                <td><input type="text" class="form-control" id="customerTel1"></td>

                            </tr>

                            <tr>

                                <td><label>车系</label></td>
                                <td><input type="text" class="form-control" id="series1"></td>

                                <td style="padding-left: 30px"><label>车型</label></td>
                                <td><input type="text" class="form-control" id="model1"></td>

                                <td style="padding-left: 30px"><label>颜色</label></td>
                                <td><input type="text" class="form-control" id="color1"></td>
                            </tr>
                            <tr>

                                <td><label>VIN</label></td>
                                <td><input type="text" class="form-control" id="vin1" readonly></td>

                                <td style="padding-left: 30px"><label>车牌号</label></td>
                                <td><input type="text" class="form-control" id="carCard1" readonly></td>

                            </tr>

                        </table>


                    </div>


                </form>
            </div>
            <div>

                <form class="form-horizontal">
                    <h5 class="page-header">车辆施工信息</h5>
                    <div class="form-inline">
                        <label>预计开工日期</label> <input type="text" class="form-control" id="startTime1" readonly>
                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                        <label>预计完工日期</label> <input type="text" class="form-control" id="endingTime1" readonly>
                    </div>

                </form>
            </div>
            <hr>
            <div>
                <h3 class="page-header">
                    装潢用品

                </h3>

                <table class="table " width="100%" id="decorationTableList">
                    <tr class="success">
                        <th width="80px">序号</th>
                        <th width="80px">用品名称</th>
                        <th width="80px">数量</th>
                        <th width="80px">计量单位</th>
                        <th width="80px">销售指导价</th>
                        <th width="80px">折扣率</th>
                        <th width="80px">实际价格</th>
                        <th width="80px">合计</th>
                    </tr>


                </table>
            </div>
            <div class="container">
                <form class="form-horizontal">
                    <div class="form-inline">
                        <label>合计金额</label><input class="form-control" id="totalPrice" readonly>
                        <label>应收金额</label><input class="form-control" id="receivables" readonly>
                        <label>赠送金额</label><input class="form-control" id="givenMoney" readonly>

                    </div>
                </form>

            </div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>

        </div>
    </div><!-- /.modal-content -->
</div><!-- /.modal -->


</body>
</html>